const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { VueLoaderPlugin } = require('vue-loader')

module.exports = {
    mode:"development",
    entry: './src/main.js',
    output: {
        filename: '[hash]-main.js',
        path: path.resolve(__dirname, 'dist'),
        clean: true,
    },
    devtool:"inline-source-map",
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: 'vue-loader'
            },
            {
                test: /\.css$/i,
                use: ['style-loader', 'css-loader'],
            }
        ],
    },
    optimization: {
        splitChunks: {
            chunks: "async",
            minChunks: 1,
        },
    },
    plugins: [
        new VueLoaderPlugin(),
        new HtmlWebpackPlugin({
            title: 'Development',
            template:"./index.html"
        }),
    ],
    resolve: {
        alias: {
            'vue$': 'vue/dist/vue.esm.js' // 用 webpack 1 时需用 'vue/dist/vue.common.js'
        }
    },
    devServer: {
        static: './dist',
    },
};